import React, { Component } from "react";
import "../assets/css/Alert.css";

class Alert extends Component {
  render() {
    var slots = {};
    var children = Array.isArray(this.props.children)
      ? this.props.children
      : [this.props.children];
    children.forEach((item) => {
      slots[item.props.slot] = item;
    });
    return (
      <div className="Alert">
        <div className="Alert_mask"></div>
        <div className="Alert_content">
          <p className="Alert_content_title">{slots["title"]}</p>
          <div className="Alert_content_main">
            {slots["content"]}
          </div>
          <div className="Alert_content_btn">
            <button onClick={this.props.cancel}>取消</button>
            <button onClick={this.props.affirm}>确认</button>
          </div>
        </div>
      </div>
    );
  }
}

export default Alert;
